#canvas{
    position: absolute;
    z-index: -10;
}

#main-right{
    text-align: center;
}
#music-name {
    display: inline-block;
    font-size: 30px;
}
#music-name>span:first-child{
    font-size: 50px;
    animation: name 6s infinite linear;
}
#left-top {
    position: relative;
    top: 460px;
    left: 68px;
    font-size: 90px;
}
#scrolling {
    height: 800px;
    overflow: hidden;
}
#main-right {
    text-align: center;
    position: relative;
    font-size: 20px;
}
#musicImg {
    border-radius: 50%;
    position: absolute;
    left: 50px;
    top: 50px;
}
audio{
    width: 100%;
}
video {
    width: 100%;
}
#musicImg{
    animation: isPlay infinite 6s linear;
    animation-play-state: paused;
    transform: rotate(0deg);
}

@keyframes isPlay {
    from{
        transform: rotate(0deg);
    }
    to{
        transform: rotate(360deg);
    }
}
@keyframes name {
    0%{
      color: #00ff1b;
    }
    10%{
     color: #00ffea;
    }
    20%{
        color: #0055ff;
    }
    30%{
        color: #0004ff;
    }
    40%{
        color: #7700ff;
    }
    50%{
        color: #ee00ff;
    }
    60%{
        color: #ff00a1;
    }
    70%{
        color: #ff0000;
    }
    80%{
        color: #ff5900;
    }
    90%{
        color: #fffb00;
    }
    100%{
        color: #00ff1b;
    }

}


body {
    background: rgb(238, 156, 215);
}

canvas {
    margin: 0;
    padding: 0;
    display: block; /*  ˉ\_(ツ)_/ˉ  */
    touch-action: none;
}

h1 {
    position: absolute;
    top: 50%;
    left: 0;
    margin: auto;
    width: 100%;
    text-align: center;
    color: #fff;
}